<template>
  <el-dialog :title="titleList[flag]+'（'+form.orderNo+'）'" :visible.sync="dialogVisible" width="30%">
    <el-form ref="form" :model="form" v-loading="loading">
      <div v-if="flag==0">
        <el-form-item label="审核结果" prop="auditResult" required>
          <el-select v-model="form.auditResult" filterable style="width: 100%">
            <el-option
              v-for="item in dict.type.sys_approve_result"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="审核意见" prop="auditRemark" :required="form.auditResult==1">
          <el-input type="textarea" v-model="form.auditRemark" placeholder="请输入"/>
        </el-form-item>
      </div>
      <div v-if="flag==1">
        <el-form-item label="快递公司" prop="expressName" required>
          <el-input v-model="form.expressName" placeholder="请输入"/>
        </el-form-item>
        <el-form-item label="快递单号" prop="expressNo" required>
          <el-input v-model="form.expressNo" placeholder="请输入"/>
        </el-form-item>
      </div>
      <div v-if="flag==2">
        <el-form-item label="检验结果" prop="checkResult" required>
          <el-select v-model="form.checkResult" filterable style="width: 100%">
            <el-option
              v-for="item in resultList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="结果描述" prop="checkResultDesc" required>
          <el-input type="textarea" v-model="form.checkResultDesc" placeholder="请输入"/>
        </el-form-item>
        <el-form-item label="上传视频" prop="fileUrl" required>
          <div>
            <div v-if="form.fileUrl" style="display: flex; align-items: center;cursor: pointer;">
              <el-link type="primary">{{ form.fileName }}</el-link>
              <i class="el-icon-close closeDiv" @click="form.fileName=null;form.fileUrl=null"></i>
            </div>
            <el-upload
              v-else
              :headers="headers"
              :action="action"
              :on-success="uploadSuccess"
              :on-progress="uploadProgress"
              :show-file-list="false"
            >
              <el-button type="primary" plain>点击上传</el-button>
            </el-upload>
          </div>
        </el-form-item>
      </div>
      <div v-if="flag==3">
        <el-form-item label="上传图片" prop="fileUrl" required>
          <div>
            <div class="myImg" v-if="form.fileUrl">
              <i class="el-icon-close" @click="form.fileUrl=null"></i>
              <el-image
                :src="form.fileUrl"
                fit="contain"
                :preview-src-list="[form.fileUrl]"
              >
              </el-image>
            </div>
            <el-upload
              v-else
              :headers="headers"
              :action="action"
              :on-success="uploadSuccess"
              :on-progress="uploadProgress"
              :show-file-list="false"
              accept=".jpg,.jpeg,.png"
            >
              <el-button type="primary" plain>点击上传</el-button>
            </el-upload>
          </div>
        </el-form-item>
      </div>
      <div v-if="flag==4">
        <el-form-item label="上传付款凭证" prop="fileUrl" required>
          <div>
            <div class="myImg" v-if="form.fileUrl">
              <i class="el-icon-close" @click="form.fileUrl=null"></i>
              <el-image
                :src="form.fileUrl"
                fit="contain"
                :preview-src-list="[form.fileUrl]"
              >
              </el-image>
            </div>
            <el-upload
              v-else
              :headers="headers"
              :action="action"
              :on-success="uploadSuccess"
              :on-progress="uploadProgress"
              :show-file-list="false"
              accept=".jpg,.jpeg,.png"
            >
              <el-button type="primary" plain>点击上传</el-button>
            </el-upload>
          </div>
        </el-form-item>
        <el-form-item label="支付方式" prop="paymentId" required>
          <el-select v-model="form.paymentId" filterable style="width: 100%">
            <el-option
              v-for="item in payList"
              :key="item.id"
              :label="item.paymentName"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="付款金额(元)" prop="returnPrice" required>
          <el-input type="number" v-model="form.returnPrice" placeholder="请输入" :min="0"/>
        </el-form-item>
      </div>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible=false">取 消</el-button>
      <el-button type="primary" @click="dialogOk">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>

import {approveSaleAfter, writeSaleAfter, checkSaleAfter, confirmSaleAfter, paySaleAfter} from "@/api/imsMng";
import {getToken} from "@/utils/auth";
import {listPayType} from "../../../../api/payMng";

export default {
  dicts: ['sys_approve_result'],
  data() {
    return {
      flag: 0,
      dialogVisible: false,
      loading: false,
      form: {
        auditResult: '',
        auditRemark: '',
        expressName: '',
        expressNo: '',
        checkResult: '',
        checkResultDesc: '',
        paymentId: '',
        vodFile: '',
        returnPrice: '',
      },
      payList:[],
      resultList: [
        {label: '无损', value: 0},
        {label: '有损', value: 1}
      ],
      titleList: ['审核', '填单', '检验', '收货', '支付'],
      headers: {
        Authorization: 'Bearer ' + getToken()
      },
      action: process.env.VUE_APP_BASE_API + '/ims/product/file/upload',
      actionImg: process.env.VUE_APP_BASE_API + '/ims/product/image/upload',
    }
  },
  methods: {
    show(flag, form) {
      this.flag = flag
      this.dialogVisible = true
      this.resetForm('form')
      this.form.afterSaleId = form.afterSaleId
      this.form.orderNo = form.orderNo
      listPayType({pageSize: -1}).then(res => {
        this.payList = res.rows
      })
    },
    uploadProgress() {
      this.loading = true
    },
    uploadSuccess(res) {
      this.loading = false
      if (res.code == 200) {
        this.$set(this.form, 'fileName', res.data.fileName)
        this.$set(this.form, 'fileUrl', res.data.fileUrl)
      } else {
        this.$message.error(res.msg)
      }
    },
    dialogOk() {
      this.$refs.form.validate(e => {
        if (e) {
          if (this.flag == 0) {
            let req = {
              afterSaleId: this.form.afterSaleId,
              auditResult: this.form.auditResult,
              auditRemark: this.form.auditRemark,
            }
            this.loading = true
            approveSaleAfter(req).then(res => {
              this.$message.success('审核成功')
              this.dialogVisible = false
              this.$emit('ok')
            }).finally(e => {
              this.loading = false
            })
          }
          if (this.flag == 1) {
            let req = {
              afterSaleId: this.form.afterSaleId,
              expressName: this.form.expressName,
              expressNo: this.form.expressNo
            }
            this.loading = true
            writeSaleAfter(req).then(res => {
              this.$message.success('填单成功')
              this.dialogVisible = false
              this.$emit('ok')
            }).finally(e => {
              this.loading = false
            })
          }
          if (this.flag == 2) {
            let req = {
              afterSaleId: this.form.afterSaleId,
              checkResult: this.form.checkResult,
              checkResultDesc: this.form.checkResultDesc,
              fileUrl: this.form.fileUrl
            }
            this.loading = true
            checkSaleAfter(req).then(res => {
              this.$message.success('检验成功')
              this.dialogVisible = false
              this.$emit('ok')
            }).finally(e => {
              this.loading = false
            })
          }
          if (this.flag == 3) {
            let req = {
              afterSaleId: this.form.afterSaleId,
              fileUrl: this.form.fileUrl
            }
            this.loading = true
            confirmSaleAfter(req).then(res => {
              this.$message.success('收货成功')
              this.dialogVisible = false
              this.$emit('ok')
            }).finally(e => {
              this.loading = false
            })
          }
          if (this.flag == 4) {
            let req = {
              afterSaleId: this.form.afterSaleId,
              fileUrl: this.form.fileUrl,
              paymentId: this.form.paymentId,
              returnPrice: this.form.returnPrice
            }
            this.loading = true
            paySaleAfter(req).then(res => {
              this.$message.success('支付成功')
              this.dialogVisible = false
              this.$emit('ok')
            }).finally(e => {
              this.loading = false
            })
          }
        }
      })
    }
  }
}
</script>
<style scoped>
.closeDiv {
  color: red;
  margin-left: 10px
}
</style>
